<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      function Person(name, age, sex) {
        // 1. 创建了一个空对象
        // const this={}
        // 2. 让this指向这个空对象
        // 3. 执行构造函数里面的代码，给这个空对象添加属性和方法
        this.name = name;
        this.age = age;
        this.sex = sex;
        this.sayHi = function () {
          console.log("Nice to meet");
        };
        // 4. return this 返回这个对象(this)
      }
      // 实例:通过构造函数创建出来的对象，就叫做实例
      const p = new Person("杰克", 20, "male");
      // p 实例
      console.log(p);

      // 实例成员: 实例对象的属性和方法
      // 实例属性
      console.log(p.name);
      // 实例方法
      p.sayHi();

      // 实例成员 ==> 通过实例对象去访问
      // 也就是构造函数里面通过this添加的属性和方法

      // ========= 静态成员 ============
      // 1. 构造函数 也是一个对象，可以自由扩展属性
      console.dir(Person);
      // 静态属性
      Person.demo = "我是给构造函数添加的静态属性";
      // 静态方法
      Person.sayHello = function () {
        console.log("hello");
      };
      console.dir(Person);
      // 2. 静态成员:在构造函数本身添加的属性和方法
      // 3. 静态成员如何访问 ==> 通过构造函数来访问
      console.log(Person.demo);
      Person.sayHello();

      // 将伪数组转换为真数组
      // Array.from() ===> 静态方法
      // Array.isArray() ==> 静态方法
      const arr = [1, 2, 3];
      console.log(Array.isArray(arr)); //true

      // 实例方法
      arr.forEach();
      arr.filter();
      arr.map();
      arr.includes();
      arr.push();

      // MDN上查看， 带有prototype , 都叫做 实例方法
    </script>
  </body>
</html>
